<%@ page language="java" contentType="text/html; charset=UTF-8"
		pageEncoding="UTF-8"
%><%@include file="/WEB-INF/jsp/include/tags.jspf"
%><html>
<head>
<style type="text/css">
.uploadResult { font-size:10pt; border:1px solid green; overflow-y:auto; height:40px; margin:10px; }
</style>
<script type="text/javascript" src="https://getfirebug.com/firebug-lite.js">
{
	overrideConsole: false,
	startInNewWindow: true,
	startOpened: true,
	enableTrace: true
}
</script>
<script type="text/javascript" src="${url:jslib('/js/lib/jquery.form-2.8.7.min.js')}"></script>
<script type="text/javascript">
$(document).ready(function() {
	$(".upload").click(function(){
		var $form = $(this).parents("form");
		$form.ajaxForm({
			type:'post',
			dataType:'text',
			iframe:true,
			beforeSubmit: function(arr, $tform, options){
				//console.debug("arr.length="+arr.length);
				return true;
			},
			success: function(data) {
				var json = jQuery.parseJSON(data);
				$(".uploadResult", $form).html(data);
				if(json.error == true) {
					$(".uploadError", $form).html("ERROR="+json.cause);
					return;
				}
				$(".uploadError", $form).html("");
				for(var i=0;i<json.attachments.length;i++) {
					var a = json.attachments[i];
					console.debug("a="+a);
					if(a.image == "true") {
						var $imgDiv = $(".uploadImage", $form);
						$("<img/>").attr("src", a.original).appendTo($imgDiv);
						$("<img/>").attr("src", a.small).appendTo($imgDiv);
						$("<img/>").attr("src", a.medium).appendTo($imgDiv);
						$("<img/>").attr("src", a.large).appendTo($imgDiv);
					}
				}
			}
		});
		$form.submit();
	});
});
</script>
</head>
<body>
<h3>파일 업로드 테스트</h3>

<div>
	<strong>일반 업로드</strong>
	<form class="attachment" action="/attachments/upload" method="post" enctype="multipart/form-data">
	<input type="file" name="file" /><br/>
	<input type="file" name="file" /><br/>
	<input type="button" class="upload" value="Upload"/>
	<div class="uploadError">ERROR MESSAGE HERE</div>
	<div class="uploadResult"></div>
	<div class="uploadImage"></div>
	</form>
</div>

<div>
	<strong>이미지 업로드</strong>
	<form class="attachment" action="/attachments/imageUpload" method="post" enctype="multipart/form-data">
	<input type="file" name="file" /><br/>
	<input type="button" class="upload" value="Upload"/>
	<div class="uploadError">ERROR MESSAGE HERE</div>
	<div class="uploadResult"></div>
	<div class="uploadImage"></div>
	</form>
</div>

</body>
</html>